<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
		<title></title>
		<!-- 引入样式 -->
		<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/vant@1.6/lib/index.css">
		<link rel="stylesheet" href="css/main.css" />
		<!-- 引入组件 -->
		<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.min.js"></script>
		<script src="https://cdn.jsdelivr.net/npm/vant@1.6/lib/vant.min.js"></script>
		<script src="html5plus://ready"></script>
		<script src="js/vue-lazyload.js"></script>
		<script src="js/vue-toasted.min.js"></script>
		<script type="text/javascript">

		</script>
	</head>
	<body>
		<div id="app">
			<van-tabbar v-model="active" @change="tabChange" fixed="true" active-color="#07c160">
				<van-tabbar-item icon="shop-o">首页</van-tabbar-item>
				<van-tabbar-item icon="qr">分类</van-tabbar-item>
				<van-tabbar-item icon="shopping-cart-o">购物车</van-tabbar-item>
				<van-tabbar-item icon="user-o">个人中心</van-tabbar-item>
			</van-tabbar>
		</div>
		<script>
			var vm = new Vue({
				el: "#app",
				data: {
					value: "",
					active: 0,
					views: [{
							id: 1,
							name: "home",
							url: "views/home.html"
						},
						{
							id: 2,
							name: "friends",
							url: "views/shop.html"
						},
						{
							id: 3,
							name: "search",
							url: "views/GouwuChe.html"
						},
						{
							id: 4,
							name: "userIndex",
							url: "Center/index.html"
						}
					]
				},
				methods: {
					//点个人中心时没登录时跳转到登陆页面
					tabChange: function() {
						plus.webview.show(this.views[this.active].name,"fade-in");
						if(this.active == 3 && localStorage.getItem("Key") == null){
							var con = confirm("是否登录？");
							if(con){
								plus.webview.show(plus.webview.create("Center/login.html", "login"),"slide-in-bottom");
							}
						}
					}
				},
				mounted() {
					var _this = this;
					document.addEventListener('plusready', function() {
						var currentWebview = plus.webview.currentWebview();
						for (var i = 0; i < _this.views.length; i++) {
							//便利出四个分页面
							var TeamWebview = plus.webview.create(_this.views[i].url, _this.views[i].name, {
								top: "0px",
								bottom: "50px",
								scrollIndicator: "none",
								zindex: 1
							});
							currentWebview.append(TeamWebview);
						}
						plus.webview.show(_this.views[0].name);
					});
				}
			})
		</script>
	</body>
</html>